<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>

	<head>
		<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<title>查看</title>
		<link rel="stylesheet" href="https://cdn.bootcss.com/dialog-polyfill/0.4.9/dialog-polyfill.min.css">
		<link rel="stylesheet" href="https://cdn.bootcss.com/material-design-icons/3.0.1/iconfont/material-icons.min.css">
		<link rel="stylesheet" href="https://cdn.bootcss.com/material-design-lite/1.3.0/material.min.css">
		<link rel="stylesheet" href="assets/css/main.css">

		<script type="text/javascript">
			var userid = ${user};
			$.ajax({
				type: "post",
				url: "showlist.do",
				async: false,
				data: {
					userid:userid
				},
				success: function(data) {
					var list = JSON.parse(data);
					var Strings=""
					for(var i=0;i<list.length;i++){
						Strings+="<div class=\"item\"><div class=\"mdl-card mdl-shadow--2dp\"><div class=\"mdl-card__title mdl-card--expand\"><h2 class=\"mdl-card__title-text\">"+
						list[i].atype+"</h2></div><div class=\"mdl-card__supporting-text\"></div><div class=\"mdl-card__actions mdl-card--border\"><a href=\""+
						list[i].url+"\" class=\"mdl-button mdl-button--colored mdl-js-button mdl-js-ripple-effect\">查看</a>	</div></div></div>"
					}
					$("#works")[0].innerHTML=Strings;
				}
			});
		</script>
	</head>

	<body class="user-page">
		<div class="mdl-layout mdl-js-layout mdl-color--grey-100">
			<div class="ribbon"></div>
			<main class="mdl-layout__content ribbon-main">
				<div class="page-content">
					<div class="mdl-grid">
						<div class="mdl-card mdl-shadow--2dp user-info">
							<div class="mdl-card__supporting-text">
								<img class="avatar" src="assets/image/avatar.jpg">
								<p>${stuname}</p>
							</div>
						</div>
						<div id="works" class="works-list" style="min-height: 500px;">
						</div>
					</div>
				</div>
				<footer class="mdl-mini-footer">
					<div class="mdl-mini-footer--left-section">
						<div class="wrapper">
							<button id="friend_button" class="mdl-button mdl-js-button mdl-button--icon"><i class="material-icons">group</i></button>
							<ul id="friend_list" class="mdl-menu mdl-menu--top-left mdl-js-menu mdl-js-ripple-effect" for="friend_button">
								<li class="mdl-menu__item">友情链接</li>
								<li class="mdl-menu__item">
									<a href="https://www.bing.com/" target="_blank">16003-16004班展示平台</a>
								</li>
							</ul>
						</div>
					</div>
					<div class="mdl-mini-footer--right-section">Made with love by
						<a href="http://moyuge.net.cn/" target="_blank">纷羽</a> &
						<a href="https://blog.sylingd.com" target="_blank">泷涯</a>
					</div>
				</footer>
			</main>
		</div>
		<script src="https://cdn.bootcss.com/material-design-lite/1.3.0/material.min.js"></script>
		<script src="https://cdn.bootcss.com/dialog-polyfill/0.4.9/dialog-polyfill.min.js"></script>
	</body>

</html>
